<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>商品分类分页</title>
		<!-- 引入Layui -->
		<script src="../bootstrap-4.6.1/jquery-3.6.0.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="../layui-v2.6.8/layui/layui.js" type="text/javascript" charset="utf-8"></script>
		<link rel="stylesheet" type="text/css" href="../layui-v2.6.8/layui/css/layui.css" />
		<!-- 引入自己 -->
		<link rel="stylesheet" type="text/css" href="../font/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="../public/public.css" />
		<link rel="stylesheet" type="text/css" href="../css/shopphead.css" />
		<link rel="stylesheet" type="text/css" href="../css/category.css" />
	</head>
	<body>
		<div id="app">
			<!-- 头部 -->
			<div class="header">
				<!-- 头部导航栏 -->
				<div class="header-nav">
					<!-- 版心 -->
					<div class="main clear">
						<!-- 地图ul -->
						<ul class="map">
							<li class="nav-show">
								<a href="javascript:void(0)" class="icon-a">
									<i class="iconfont">&#xec3f;</i>
									<span class="font">地区</span>
								</a>
								<!-- 国内外地区 -->
								<div class="map-land nav-collapse">
									<div class="item-lists">
										<div class="item">
											<a href="">北京</a>
										</div>
										<div class="item">
											<a href="">北京</a>
										</div>
										<div class="item">
											<a href="">北京</a>
										</div>
										<div class="item">
											<a href="">北京</a>
										</div>
										<div class="item">
											<a href="">北京</a>
										</div>
									</div>
								</div>
							</li>
						</ul>
						<ul class="go-index">
							<!-- 返回首页 -->
							<li>
								<a href="../index.html">
									<i class="iconfont">&#xe600;</i>
									<span class="font">首页</span>
								</a>
							</li>
						</ul>
						<!-- 导航ul -->
						<ul class="nav-r">
							<li>
								<a href="login.html" id="userIndex">你好，请登录</a>
								&nbsp;&nbsp;
								<a href="register.html">免费注册</a>
							</li>
							<li class="spacer"></li>
							<li>
								<a href="">我的订单</a>
							</li>
							<li class="spacer"></li>
							<li class="cw-icon nav-show">
								<a href="">我的京东</a>
								<i class="iconfont">&#xe65f;</i>
								<div class="my-jd nav-collapse">

								</div>
							</li>
							<li class="spacer"></li>
							<li>
								<a href="">京东会员</a>
							</li>
							<li class="spacer"></li>
							<li class="cw-icon  nav-show">
								<a href="">企业采购</a>
								<i class="iconfont">&#xe65f;</i>
								<div class="enterprise nav-collapse">

								</div>
							</li>
							<li class="spacer"></li>
							<li>
								<a href="">客户服务</a>
							</li>
							<li class="spacer"></li>

							<li class="cw-icon  nav-show">
								<a href="">网站导航</a>
								<i class="iconfont">&#xe65f;</i>
								<div class="site-navigation nav-collapse">

								</div>
							</li>
							<li class="spacer"></li>
							<li class="cw-icon  nav-show">
								<a href="address.html">我的地址</a>
							</li>
							<li class="spacer"></li>
							<li>
								<a href="">网站无障碍</a>
							</li>
						</ul>
					</div>
				</div>
				<!-- 头部logo搜索 -->
				<div class="logo-sea">
					<div class="main">
						<!-- 左边logo -->
						<div class="left-logo">
							<h1>

							</h1>
						</div>
						<!-- 中间搜索 -->
						<div class="center-sea">
							<!-- 顶部搜索 -->
							<div class="search-t">
								<!-- 搜索盒子 -->
								<div class="from-box">
									<input type="text" id="sea-input" value="" />
									<span class="iconfont">
										&#xe663;
									</span>
									<input type="button" id="sea-btn" value="&#xe61e;" class="iconfont" />
								</div>
							</div>
						</div>
					</div>
				</div>

			</div>
			<!-- 内容 -->
			<div class="contxet">
				<div class="main">
					<!-- 分页商品 -->
					<div class="page">
						<ul>
							<li>
								<!-- 左边盒子 -->
								<div class="left-img">
									<img src="../img/background.png" >
								</div>
								<!-- 右边盒子 -->
								<div class="right-body">
									<!-- 商品标题· -->
									<div class="sh-title">
										<h3>小米电视6 至尊版 65英</h3>
									</div>
									<!-- 商品价格· -->
									<div class="sh-price">
										<span>￥1227</span>
									</div>
									<!-- 商品介绍 -->
									<div class="sh-contxet">
										通过核心方法：laypage.render(options) 来设置基础参数。由于使用非常简单，本篇直接罗列核心接口的参数选项
									</div>
								</div>
							</li>
							<li>
								<!-- 左边盒子 -->
								<div class="left-img">
									<img src="../img/background.png" >
								</div>
								<!-- 右边盒子 -->
								<div class="right-body">
									<!-- 商品标题· -->
									<div class="sh-title">
										<h3>小米电视6 至尊版 65英</h3>
									</div>
									<!-- 商品价格· -->
									<div class="sh-price">
										<span>￥1227</span>
									</div>
									<!-- 商品介绍 -->
									<div class="sh-contxet">
										通过核心方法：laypage.render(options) 来设置基础参数。由于使用非常简单，本篇直接罗列核心接口的参数选项
									</div>
								</div>
							</li>
							<li>
								<!-- 左边盒子 -->
								<div class="left-img">
									<img src="../img/background.png" >
								</div>
								<!-- 右边盒子 -->
								<div class="right-body">
									<!-- 商品标题· -->
									<div class="sh-title">
										<h3>小米电视6 至尊版 65英</h3>
									</div>
									<!-- 商品价格· -->
									<div class="sh-price">
										<span>￥1227</span>
									</div>
									<!-- 商品介绍 -->
									<div class="sh-contxet">
										通过核心方法：laypage.render(options) 来设置基础参数。由于使用非常简单，本篇直接罗列核心接口的参数选项
									</div>
								</div>
							</li>
							<li>
								<!-- 左边盒子 -->
								<div class="left-img">
									<img src="../img/background.png" >
								</div>
								<!-- 右边盒子 -->
								<div class="right-body">
									<!-- 商品标题· -->
									<div class="sh-title">
										<h3>小米电视6 至尊版 65英</h3>
									</div>
									<!-- 商品价格· -->
									<div class="sh-price">
										<span>￥1227</span>
									</div>
									<!-- 商品介绍 -->
									<div class="sh-contxet">
										通过核心方法：laypage.render(options) 来设置基础参数。由于使用非常简单，本篇直接罗列核心接口的参数选项
									</div>
								</div>
							</li>
							<li>
								<!-- 左边盒子 -->
								<div class="left-img">
									<img src="../img/background.png" >
								</div>
								<!-- 右边盒子 -->
								<div class="right-body">
									<!-- 商品标题· -->
									<div class="sh-title">
										<h3>小米电视6 至尊版 65英</h3>
									</div>
									<!-- 商品价格· -->
									<div class="sh-price">
										<span>￥1227</span>
									</div>
									<!-- 商品介绍 -->
									<div class="sh-contxet">
										通过核心方法：laypage.render(options) 来设置基础参数。由于使用非常简单，本篇直接罗列核心接口的参数选项
									</div>
								</div>
							</li>
						</ul>
					</div>
					<!-- 分页页码 -->
					<div id="pages">

					</div>
				</div>

			</div>
			<!-- 尾部 -->
			<div class="footer">

			</div>
		</div>

	</body>
	<script src="../public/public.js" type="text/javascript" charset="utf-8"></script>
	<script src="../js/category.js" type="text/javascript" charset="utf-8"></script>
</html>
